<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>乐鲜生活后台管理系统</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
  <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  <link href="https://cdn.bootcss.com/admin-lte/2.4.3/css/AdminLTE.min.css" rel="stylesheet">
  <link href="https://cdn.bootcss.com/admin-lte/2.4.3/css/skins/_all-skins.min.css" rel="stylesheet">
  <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script src="https://cdn.bootcss.com/admin-lte/2.4.3/js/adminlte.min.js"></script>
  <link rel="stylesheet" type="text/css" media="screen" href="css/index/index.css" />
  <script src="https://cdn.bootcss.com/vue/2.5.16/vue.js"></script>
  <script src="https://cdn.bootcss.com/vue-resource/1.5.1/vue-resource.js"></script>
  <script src="../resource/ply/Ply.min.js"></script>
  <link rel="stylesheet" href="../css/goodClass.css">
  <link rel="stylesheet" href="../resource/ply/ply.css">
  
</head>

<body class="skin-purple">
  <!-- Main Header -->
  <header id="app-header">
    <component-header></component-header>
  </header>

  <script src="../js/header.js"></script>

  <aside id="app-sidebar">
    <component-sidebar></component-sidebar>
  </aside>

  <script src="../js/sidebar.js"></script>

  <div id="app-gm">
    <component-content title="商品列表">
      <div class="callout callout-info">
        <h4>提示!</h4>

        <p>这个页面提供了商品信息修改和商品删除功能，只有超级管理员可操作</p>
      </div>
      <component-box class="box-solid box-primary" title="所有商品信息">
        <div class="col-sm-12 dataTables_wrapper form-inline dt-bootstrap">
          <div class="row">
            <h4 style="font-weight: bold">分类筛选:</h4>
            <div class="col-sm-9 row">
              <div class="col-sm-4">
                <h5 class="col-sm-5" style="font-weight: bold">一级类别:
                </h5>
                <div class="col-sm-6" class="btn-group">
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
                    {{currentCategory1}}
                    <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu">
                    <li v-for="(item,index) in categoryTree">
                      <a v-on:click="onPriCateClick(index)">{{item.primaryCategory}}</a>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="col-sm-4">
                <h5 class="col-sm-5" style="font-weight: bold; margin-left: 20px">二级类别:
                </h5>
                <div class="col-sm-6" class="btn-group">
                  <button type="button" :disabled="isCategory2Valid" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
                    {{currentCategory2}}
                    <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu">
                    <li v-for="(item, index) in currentCategory2_sets">
                      <a @click="onSecCateClick(index)">{{item}}</a>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="col-sm-4">
                <h5 class="col-sm-5" style="font-weight: bold;margin-left: 20px">特别分类:
                </h5>
                <div class="col-sm-6" class="btn-group">
                  <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" disabled="true">
                    特殊推荐
                    <span class="caret"></span>
                  </button>
                  
                </div>
              </div>
            </div>
            <div class="col-sm-3">
              <div class="input-group row  pull-right">
                <input type="text" class="form-control" placeholder="搜索..." v-model="currentSearchPattern">
                <span class="input-group-btn">
                  <button class="btn btn-default" type="button" @click="performSearch" :disabled="isSearching">
                    <i class="fa fa-search"></i>
                  </button>
                </span>
              </div>
            </div>
          </div>

        </div>
        <table class="table table-bordered table-condensed table-hover dataTable" role="grid">
          <thead>
            <th class="sorting_asc col-sm-1 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold">商品名称</h5>
            </th>
            <th class="sorting_asc col-sm-1 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold">商品价格/元</h5>
            </th>
            <th class="sorting_asc col-sm-1 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold">商品库存/件</h5>
            </th>

            <th class="sorting_asc col-sm-2 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold">门店信息</h5>
            </th>
            <th class="sorting_asc col-sm-1 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold">是否激活</h5>
            </th>
            <th class="sorting_asc col-sm-3 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold">商品描述</h5>
            </th>
            <th class="sorting_asc col-sm-2 text-center" tableindex="0" rowspan="1" colspan="1" aria-sort="ascending">
              <h5 style="font-weight: bold;margin-left: 18px">操作</h5>
            </th>
          </thead>
          <tbody>
            <tr role="row" v-for="(good,index) in goods">
              <td class="text-center">
                <h5>{{good.goods_name}}</h5>
              </td>
              <td class="text-center clearfix">
                <h5>{{good.price}}</h5>
              </td>
              <td class="text-center clearfix">
                <h5>{{good.inventory}}</h5>
              </td>
              <td class="text-center clearfix">
                <h5>{{good.store_name}}</h5>
              </td>
              <td class="text-center clearfix">
                <h5>{{good.active}}</h5>
              </td>
              <td class="text-center clearfix">
                <h5>{{good.description}}</h5>
              </td>
              <td class="row clearfix">
                <div class="col-sm-3"></div>
                <button type="button" class="btn btn-lg btn-primary col-xs-3 btn-sm" @click="modifyItem(index)">修改</button>
                <div class="col-sm-1"></div>
                <button type="button" class="btn btn-lg btn-danger col-xs-3 btn-sm" @click="deleteItem(index)">删除</button>
              </td>
            </tr>
          </tbody>

        </table>
      </component-box>
      <script src="../js/box.js"></script>

    </component-content>
    <script src="../js/content.js"></script>
  </div>

  <script src="../js/goodModification.js"></script>

</body>

</html>